import { Component } from 'react';
import {Checkbox,Button} from 'antd';
// import "@components/Kedirot/kindeditor-all.js"
import Script from 'react-load-script';
import KindEditor from '@/components/KindEditor';
export default class analysis extends Component {
    state = {
        checked: false,
        disabled: false,
        htmlContent: '<h3>请输入</h3>',

      };
    toggleChecked = () => {
        this.setState({ checked: !this.state.checked });
        console.log('checked = ', this.state.checked);
    };

    toggleDisable = () => {
        this.setState({ disabled: !this.state.disabled });
    };

    onChange = e => {
        console.log('checked = ', e.target.checked);
        this.setState({
        checked: e.target.checked,
        });
    };
    onEditorStateChange=(content)=> {
        console.log("recieved HTML content", content);
        
      }
      
    render(){
        const label = `${this.state.checked ? 'Checked' : 'Unchecked'}-${
            this.state.disabled ? 'Disabled' : 'Enabled'
        }`;
        console.log('this.state.checked',this.state.checked);
        const checked2 = this.state.checked;
        return (
        <div>
            {/* <Script
              url="http://kindeditor.net/ke4/kindeditor-all-min.js?t=20160331.js"
              onCreate={this.handleScriptCreate.bind(this)}
              onError={this.handleScriptError.bind(this)}
              onLoad={this.handleScriptLoad.bind(this)}
            /> */}
            <p style={{ marginBottom: '20px' }}>
            <Checkbox
                checked={checked2}
                disabled={this.state.disabled}
                onChange={this.onChange}
            >
                {label}
            </Checkbox>
            </p>
            <p>
            <Button type="primary" size="small" onClick={this.toggleChecked}>
                {!this.state.checked ? 'Check' : 'Uncheck'}
            </Button>
            <Button
                style={{ marginLeft: '10px' }}
                type="primary"
                size="small"
                onClick={this.toggleDisable}
            >
                {!this.state.disabled ? 'Disable' : 'Enable'}
            </Button>
            </p>
            {/* <link href="http://kindeditor.net/ke4/themes/default/default.css?t=20160331.css" rel="stylesheet" /> */}
            {/* <textarea id="ke_demo" name="content" rows="20" cols="100" style={{width:"95%",height:200}} value="你好这里是测试"
            onChange={()=>{
                KindEditor.ready(function(K) {
                    K.create('#ke_demo', {
                        allowFileManager : true
                    });
                });
                console.log(3);
            }}
            ></textarea> */}
            <KindEditor
            onChange={this.onEditorStateChange}
            value="测试一点内容"
            ></KindEditor>
        </div>
        );
    }
}